<template>
  <div style="padding: 20px">
    <el-button type="primary" @click="visible = true">新增配置</el-button>

    <Form
      :role-list="roleList"
      :drawer="visible"
      :config-list="configList"
      @close:drawer="visible = false"
      @add-success="addSuccess"
    />
    <Process2 ref="Process2" :list="configList" :role-list="roleList" @onSubmit="onSubmit" />
  </div>

</template>

<script>
import Process2 from './Process2.vue'
import request from '@/utils/request'
import Form from './Form.vue'

export default {
  components: {
    Form,
    // Process,
    Process2
  },
  data() {
    return {
      form: {},
      visible: false,
      roleList: [],
      configList: []
    }
  },
  created() {
    this.getConfig()
    this.getRoleList()
  },
  methods: {
    getConfig() {
      request({ url: 'system/approveConfig/list', method: 'get' }).then(res => {
        if (res.code === 200) {
          this.configList = [...res.data]
        }
      })
    },
    getRoleList() {
      request({ url: 'system/role/list', method: 'get', pageSize: 1000 }).then(res => {
        if (res.code == 200) {
          this.roleList = res.rows.map(item => ({ label: item.roleName, value: `${item.roleId}` }))
        }
      })
    },
    addSuccess() {
      this.visible = false
      this.$refs.Process2?.initEarcht('init')
      this.getConfig()
    },
    onSubmit() {
      this.getConfig()
    }

  }

}
</script>
